import React, { useState } from 'react'

export default function App() {
  console.log('app执行了')
  // 注意: 虽然组件更新,useState被调用了很多次,但是useState内部会把数据缓存起来,返回的是正确的数据
  // 注意: 如果修改状态数据没有变化,useState已经优化过了,组件就不会重复的更新了
  const [count, setCount] = useState(9)
  const [msg, setMsg] = useState('嘿嘿嘿')
  return (
    <div>
      App
      <hr />
      <p>{count}</p>
      <p>{msg}</p>
      <button
        onClick={() => {
          setCount(count + 1)
        }}
      >
        +
      </button>
      <button
        onClick={() => {
          setMsg('laotao.lsp')
        }}
      >
        按钮
      </button>
    </div>
  )
}
